<!doctype html>
<html xmlns:th="http://www.thymeleaf.org" lang="zh">

<head th:replace="~{commons/head::head}"></head>

<body>

  <!-- Main -->
  <main id="main">

    <!-- Password Reset 13 - Bootstrap Brain Component -->
    <section class="bg-light py-3 py-md-5 min-vh-100 d-flex justify-content-center align-items-center">
      <div class="container">
        <div class="row justify-content-center">
          <div class="col-12 col-sm-10 col-md-8 col-lg-6 col-xl-5 col-xxl-4">
            <div class="card border border-light-subtle rounded-3 shadow-sm">
              <div class="card-body p-3 p-md-4 p-xl-5">
                <div class="text-center mb-3">
                  <a th:href="@{index}">
                    <img th:src="@{/assets/img/branding/console-logo.svg}" alt="Logo" width="175" height="57">
                  </a>
                </div>
                <h2 class="fs-6 fw-normal text-center text-secondary mb-4" th:text="#{login.resetPasswordDescribe}"></h2>
                <form action="#!">
                  <div class="row gy-2 overflow-hidden">
                    <div class="col-12">
                      <div class="form-floating">
                        <input type="email" class="form-control" name="email" id="email" placeholder="name@example.com" required>
                        <label for="email" class="form-label" th:text="#{login.email}"></label>
                      </div>
                    </div>
                    <div class="col-12">
                      <div class="d-grid my-3">
                        <button class="btn btn-primary btn-lg" type="submit" th:text="#{login.resetPassword}"></button>
                      </div>
                    </div>
                    <div class="col-12">
                      <div class="d-flex gap-2 justify-content-between">
                        <a th:href="@{index}" class="link-primary text-decoration-none" th:text="#{login.signIn}"></a>
                        <a th:href="@{register}" class="link-primary text-decoration-none" th:text="#{register}"></a>
                      </div>
                    </div>
                  </div>
                </form>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>

  </main>

  <!-- BSB Body End -->
</body>

</html>
